<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <!-- <div id="box">
        svadvs 
        <div class="child red">123</div>
        <div class="child">345</div>
        <p>sadscd</p>
    </div>
    <div id="bi">
        <div class="bi child">1212</div>
        <div class="bi">456</div>
    </div>
    <div class="test">123</div>


    <div id="father">
        <p class="www">hluikjjwv</p>
        <pz id="child-p">sfdbg</pz>
    </div> -->
    <script>
        // let test = document.getElementsByClassName('test')[0];
        // let span = document.createElement('span');//创建空的标签DOM元素
        // span.innerHTML = '<br>1234';
        // span.fontSize = '30px';
        // // span.innerText = '234'
        // console.log('span=='+span);
        // test.appendChild(span);//将span子元素添加到test里面

        // let father = document.getElementById('father');
        // let child = document.getElementById('child-p');
        // console.log(child);
        // father.removeChild(child);//删除元素
        // let box = document.getElementById('box');
        // console.log( 'box===>',box);
        // let su = document.getElementsByClassName('child');
        // console.log('child===>',su);
        // let p = document.getElementsByTagName('p');
        // console.log('p',p);
        // var a = box.getAttribute('class');
        // console.log('a===>',a);
        // box.setAttribute('style','background-color:green;')
        // box.style.border = 'solid 2px black';
        // box.style.borderRadius = '50px';

        // let bi = document.getElementsById('bi');
        // console.log('bi==>'+bi);
        // let bi1 = bi.childNodes;
        // for(var i = 0; i <= bi1.length;i++){
        //     if(bi1[i].nodeType ==1 ){
        //         b1i[i].style.color = 'blue';
        //     }
        // }
    </script>
    
</body>
</html>